import React,{Component} from 'react';
import {NavLink} from 'react-router-dom';
import { Menu, Icon } from 'antd';
const SubMenu = Menu.SubMenu;
const MenuItemGroup = Menu.ItemGroup;
class Nav extends Component{
    state = {
        current: 'mail',
      }
    
      handleClick = (e) => {
        console.log('click ', e);
        this.setState({
          current: e.key,
        });
      }
    render(){
        return(
            <Menu
            onClick={this.handleClick}
            selectedKeys={[this.state.current]}
            mode="horizontal"
          >
            <Menu.Item key="mail">
                <NavLink to="/" activeClassName="active"exact>首页</NavLink>
            </Menu.Item>
            <Menu.Item key="app">
                <NavLink to="/product" activeClassName="active">订单详情</NavLink>
            </Menu.Item>
            <Menu.Item key="about">
                <NavLink to="/about" activeClassName="active">产品模块</NavLink>
            </Menu.Item>
            <Menu.Item key="alipay">
                <NavLink to="/cart" activeClassName="active" rel="noopener noreferrer">购物车</NavLink>
            </Menu.Item>
          </Menu>
        )
    }
}
export default Nav;